<template>
  <div
    :class="['text-item',{'forbid-copy':data.config.forbidCopy}]"
    @copy.native="copy($event)"
    @paste.native="copy($event,true)"
    @contextmenu.native="copy($event)"
  >{{(view && data.databinding) ? content : data.config.content}}</div>
</template>

<script>
import { getSourceData } from '../common'
export default {
  props: ['data', 'file', 'view', 'index'],
  data () {
    return {
      content: ''
    };
  },
  watch: {
    file: {
      handler () {
        this.dataHandle();
      }
    }
  },
  methods: {
    // 是否禁止复制
    copy (e, tip) {
      let { forbidCopy } = this.data.config;
      if (forbidCopy) {
        e.preventDefault()
        if (tip) {
          // this.$Message.error('禁止复制')
        }
      } else {
        return true
      }
    },

    // 数据处理
    dataHandle () {
      this.content = this.data.config.content;
      if (this.file) {
        // 对于文本组件暂仅显示数据源绑定值
        let { databinding } = this.data;
        if (databinding) {
          try {
            let value = getSourceData(this.file, databinding);
            this.content = value;
          } catch (e) {
            console.log(e);
            this.$Message.error('数据获取出错');
          }
        }
      }
    }
  },
  created () {
    this.dataHandle();
  }
};
</script>

<style lang="less" scoped>
.forbid-copy {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
</style>
